<template>
  <view>
    <uni-popup ref="popup" background-color="#fff" style="z-index:999">
      <view class="popup-content">
        <p class="popup_title">切换账户身份</p>
        <view class="popup_height">
          <!-- 个人 -->
          <view class="bottom_list" @click="changeCompany(0)">
            <view>
              <view class="title_vi">{{ personUser.name }}
                <view
                    v-if="$store.getters.staffInfo.companyId == 0 && $store.getters.staffInfo.isCertify == 0"
                    class="certiy"
                >
                  <personalGray class="certiyImg"/>
                  <text style="color: #999999;">未实名认证</text>
                </view>
                <view v-else class="certiy">
                  <personalGreen class="certiyImg"/>
                  <text class="text-primary">已实名认证</text>
                </view>
              </view>
              <view style="color: #999999;font-size: 20rpx;margin-bottom: 20rpx;">个人账号：{{ personUser.nickId }}</view>
            </view>
          </view>
          <!-- 企业列表 -->
          <view class="bottom_list" v-for="(item,index) in allCompanys" :key="index" @click="changeCompany(item)">
            <view>
              <view class="title_vi">{{ item.name }}
                <span v-if="item.isCertify == 0" class="certiy">
									<companyGray class="certiyImg"/>
									<text style="color: #999999;">未实名认证</text>
								</span>
                <span v-else class="certiy">
									<companyGreen class="certiyImg"/>
									<text class="text-primary">已实名认证</text>
								</span>
              </view>
              <view style="color: #999999;font-size: 20rpx;margin-bottom: 20rpx;">企业编号：{{ item.companyNickId }}</view>
            </view>
          </view>
        </view>
        <!-- 底部按钮 -->
        <uni-list>
          <uni-list-item class="btn_list">
            <!-- 加入企业 -->
            <template v-slot:header>
              <button class="slot_btn" plain @click="join">
                <i class="iconfont" style="margin-right: 3rpx;">&#xe6c9;</i>加入企业
              </button>
            </template>
            <!-- 创建企业 -->
            <template v-slot:body>
              <button class="slot_btn" plain @click="buildCompany">
                <i class="iconfont icon-jiahao" style="margin-right: 3rpx;"></i>创建企业
              </button>
            </template>
            <!-- 查看全部企业 -->
            <template v-slot:footer>
              <button class="slot_btn" plain @click="watchCompany">查看全部企业</button>
            </template>
          </uni-list-item>
        </uni-list>
      </view>
    </uni-popup>
    <!-- 加入企业 -->
    <joinOrCreateCompany ref="inputDialog" @success="initCompanyList"/>
    <!-- 企业实名认证弹出框 -->
    <company-RealName ref="companyRealNamePopup"/>
    <!-- 个人实名认证弹出框 -->
    <!-- <personal-RealName ref="personalRealNamePopup" /> -->
  </view>
</template>

<script>
import companyGray from "@/components/svg/companyGray"
import companyGreen from "@/components/svg/companyGreen"
import personalGray from "@/components/svg/personalGray"
import personalGreen from "@/components/svg/personalGreen"
import joinOrCreateCompany from '@/components/joinOrCreateCompany/joinOrCreateCompany'
import companyRealName from "@/components/identityPoup/companyRealName"
import personalRealName from "@/components/identityPoup/personalRealName"

export default {
  components: {
    companyGray,
    companyGreen,
    personalGray,
    personalGreen,
    joinOrCreateCompany,
    companyRealName,
    personalRealName
  },
  name: "identityPoup",
  data() {
    return {
      // 企业列表
      allCompanys: [],
      // 0未认证  1已认证
      isCertify: '',
      // true企业 false个人
      isCompany: '',
      currentUser: '',
      personUser: '',
    };
  },
  created() {
    this.initCompanyList()
  },
  methods: {
    open() {
      this.$refs.popup.open('bottom')
    },
    initCompanyList() {
      // 个人
      if (this.$store.getters.staffInfo.companyId == 0) {
        this.currentUser = this.$store.getters.staffInfo.name;
        this.isCertify = this.$store.getters.staffInfo.isCertify
      } else {
        // 企业
        this.currentUser = this.$store.getters.staffInfo.companys.filter((e) => e.id == this.$store.getters.staffInfo.companyId)[0].name;
        this.isCertify = this.$store.getters.companyInfo.isCertify
      }
      this.personUser = this.$store.getters.staffInfo
      this.allCompanys = this.$store.getters.staffInfo.companys;
    },
    /** 查看全部企业 */
    watchCompany() {
      this.$refs.popup.close()
      if (this.isCertify == 0) {
        this.$refs.companyRealNamePopup.open(this.$store.getters.companyInfo.id)
      } else {
        uni.navigateTo({
          url: '/pages/common/allCompany/allCompany'
        })
      }
    },
    /** 创建企业 */
    buildCompany() {
      this.$refs.popup.close()
      if (this.isCertify == 0) {
        this.$refs.companyRealNamePopup.open(this.$store.getters.companyInfo.id)
      } else {
        this.$refs.inputDialog.toOpenDialog(1)
      }
    },
    /** 加入企业 */
    join() {
      this.$refs.popup.close()
      if (this.isCertify == 0) {
        this.$refs.companyRealNamePopup.open(this.$store.getters.companyInfo.id)
      } else {
        this.$refs.inputDialog.toOpenDialog(2)
      }
    },
    // 切换身份
    changeCompany(event) {
      this.$refs.popup.close()

      // 防止重复点击切换
      if (event == 0 && this.$store.getters.staffInfo.companyId == 0) {
        // this.$refs.personalRealNamePopup.open()
        return;
      }
      if (this.$store.getters.staffInfo.companyId == event.id) {
        return;
      }

      // 判断企业是否认证
      if (event.isCertify == 0 && event != 0) {
        this.$refs.companyRealNamePopup.open(event.id)
        return;
      }
      this.$emit('changeCompany', event)
    },
  }
}
</script>
<style lang="scss" scoped>
@import "../../static/scss/index.scss";

.certiyImg {
  width: 28rpx;
  height: 30rpx;
  margin: 3rpx 6rpx 0 6rpx;
}

.certiy {
  font-size: 25rpx;
  display: flex;
}

.bottom_list {
  border-bottom: 1rpx solid #e7e7e7;
  padding: 0 50rpx;
  height: 120rpx;
  display: flex;
  justify-content: space-between;
  align-items: center;
  color: #666666;

  .title_vi {
    width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1; //显示行数
    white-space: nowrap;
    color: #666666;
    font-size: 26rpx;
    margin: 20rpx 0 8rpx;
    display: flex;
    align-items: center;
  }
}

.slot_btn {
  font-size: 24rpx;
  line-height: 50rpx !important;
  border: 1rpx solid #cccccc;
  margin-left: auto;
  margin-right: auto;
}

.popup-content {
  .popup_title {
    background: $uni-color-primary;
    height: 70rpx;
    line-height: 70rpx;
    padding-left: 50rpx;
    color: #fff;
    font-size: 30rpx;
  }

  .popup_height {
    height: 595rpx;
    overflow-y: scroll;
  }
}
</style>
